<template>
  <div>
    <Header></Header>
    <!-- 9.注册 router-view -->
    <router-view></router-view>

    <!--<Footer></Footer>-->
    <!--需求，当路径是 login和register 时，不显示页面底部模块-->
    <!--下面这样的写法没有任何毛病，但是一旦后期出现多个页面都需要这样的配置后，-->
    <!--  这里的代码将会很长，这里采用 meta 元素解决这样的问题，具体实现参考笔记 'meta的使用' -->
    <!--<Footer v-show="$route.path !== '/login' && $route.path !== '/register' "></Footer>-->

    <!--2.以下是 meta 的使用-->
    <!--如果路由中没有 'meta'选项，将是 false，然后取反为 true，将正常显示，反之亦然-->
    <Footer v-show="!$route.meta.isHidden"></Footer>
  </div>
</template>

<script>
import Header from '@/components/Header'
import Footer from '@/components/Footer'

export default {
  name: "App",
  components: {
    Header,
    Footer
  }
}
</script>

<style scoped>

</style>
